<extend name="_Layout/maintwo"/>
<block name="style">
    <style>
        .lbw_btn_margin{
            margin-top: 3% !important;
        }
        .lbw_btn_a_margin{
            height: 85px !important;
        }
        .lbw_btn_color_one{
            color: #FFF;
            font-weight: bold;
            background-color: #44CDAF;
        }
        .lbw_btn_color_two{
            color: #FFF;
            font-weight: bold;
            background-color: #2646A1;
        }
        .lbw_btn_p_{
            font-size: 8px;
            color: #FFF;
            margin-left: 12px;
        }
        .lbw_header_bz{
            color: #FFF !important;
            font-weight: bold !important;
            background-color: #00B630 !important;
        }
        .lbw_header_bztwo{
            color: #FFF !important;
            font-weight: bold !important;
            background-color: #2646A1 !important;
        }
        .btn-default:hover, .btn-default:focus, .btn-default.focus, .btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default{
            color: #FFF;
            background-color: #F19307;
            border-color: #F19307;
        }
        .lbw_plist_mx{
            margin-top: 20px;
        }

        .lbw_plist_li{
            background-color: #FFF;
            border-left: none !important;
            border-right: none !important;
            color: #656565;
            border-radius: 0px !important;
            font-weight: bold;
        }
        .lbw_pdlist_sjx {
            width: 50px;
            position: relative;
            top: -6px;
            right: -10px;
        }
        .lbw_table_tr{
            background-color: #00B630;
            color: #FFF;
        }
    </style>
    <script type="text/javascript" src="__HOME_JS__/jquery.easyui.min.js"></script>
    <link href="__HOME_CSS__/tree.css" rel='stylesheet' type='text/css' />
</block>
<block name="main">
    <div class="row lbw_plist_mx">
        <div class="col-md-12">
            <div class="panel panel-default">
                <!-- Default panel contents -->
                <div class="panel-heading lbw_header_bz">家族明细列表</div>
                <div class="table-responsive" style="padding: 15px;">
                    <table class="table table-bordered" style="border: 1px solid #DDD;">
                        <thead>
                        <tr class="lbw_table_tr">
                            <th>序号</th>
                            <th>姓名</th>
                            <th>级别</th>
                            <th>手机号</th>
                            <th>直属下线</th>
                            <th>加入时间</th>
                        </tr>
                        </thead>
                        <volist name="tuijianren" id="asf" empty="暂时没有数据">
                                <tbody>
                                <tr>
                                    <th scope="row">{$i}</th>
                                    <td>{$asf.realname}</td>
                                    <td><if condition="$asf.lbw_viplevel eq 0">V1<elseif condition="$asf.lbw_viplevel eq 1"/>V2<elseif condition="$asf.lbw_viplevel eq 2"/>V3<elseif condition="$asf.lbw_viplevel eq 3"/>V4<else /></if></td>
                                    <td>{$asf.mobile}</td>
                                    <td>是</td>
                                    <td><?php echo date("Y-m-d H:i:s",$asf['ctime']); ?></td>
                                </tr>
                                </tbody>
                            </volist>
                    </table>
                    </div>
                </div>

            <div class="panel panel-default">
                <!-- Default panel contents -->
                <div class="panel-heading lbw_header_bz">会员结构图</div>
                <ul id="tt"></ul>
            </div>

            </div>
        </div>
    <script type="text/javascript">
        function convert(rows){
            function exists(rows, parentId){
                for(var i=0; i<rows.length; i++){
                    if (rows[i].id == parentId) return true;
                }
                return false;
            }

            var nodes = [];
            // get the top level nodes
            for(var i=0; i<rows.length; i++){
                var row = rows[i];
                if (!exists(rows, row.parentId)){
                    nodes.push({
                        id:row.id,
                        text:row.name
                    });
                }
            }

            var toDo = [];
            for(var i=0; i<nodes.length; i++){
                toDo.push(nodes[i]);
            }
            while(toDo.length){
                var node = toDo.shift();    // the parent node
                // get the children nodes
                for(var i=0; i<rows.length; i++){
                    var row = rows[i];
                    if (row.parentId == node.id){
                        var child = {id:row.id,text:row.name};
                        if (node.children){
                            node.children.push(child);
                        } else {
                            node.children = [child];
                        }
                        toDo.push(child);
                    }
                }
            }
            return nodes;
        }

        $(function(){
            $('#tt').tree({
                url: "{:U('Home/User/tree')}",
                treeField:'name',
                loadFilter: function(rows){

                    return convert(rows);
                }


            });

        });
    </script>
</block>
